<template>
    <div class="sideNav">
        <el-menu :default-active="this.$route.path" router text-color="#fff" background-color="#545c64"
            active-text-color="#ffd04b">
            <el-menu-item index="/admin">
                <i class="el-icon-monitor"></i>
                <span slot="title">首页</span>
            </el-menu-item>
            <el-submenu index="2">
                <template slot="title">
                    <i class="el-icon-user-solid"></i>
                    <span>用户管理</span>
                </template>
                <el-menu-item-group>
                    <el-menu-item index="/adminManage">管理员管理</el-menu-item>
                    <el-menu-item index="/memberManage">会员管理</el-menu-item>
                </el-menu-item-group>
            </el-submenu>
            <el-menu-item index="/columnManage">
                <i class="el-icon-menu"></i>
                <span slot="title">栏目管理</span>
            </el-menu-item>
            <el-menu-item index="/articleManage">
                <i class="el-icon-document"></i>
                <span slot="title">文章管理</span>
            </el-menu-item>
            <el-menu-item index="/tabManage">
                <i class="el-icon-star-on"></i>
                <span slot="title">标签管理</span>
            </el-menu-item>
            <el-menu-item index="/commentManage">
                <i class="el-icon-s-comment"></i>
                <span slot="title">评论管理</span>
            </el-menu-item>
        </el-menu>
    </div>
</template>

<script>
    export default {
        name: 'sideNav'
    };
</script>

<style scoped lang="less">
    .sideNav {
        width: 200px;
        height: 100vh;
        background-color: #545c64;

        /deep/ .el-menu {
            border-right: 0;
        }
    }
</style>